<template>
  <div class="home">
  </div>
</template>

<script>
//拦截器:在请求或响应被处理前拦截它们
//分为两种：1.请求拦截器，响应拦截器
import axios from 'axios'
export default {
  name: 'axios3-3',
  created(){
    //请求拦截器
    axios.interceptors.request.use
    (config=>{
            // 在发送请求前做些什么
            return config
        },err=>{
            //请求错误的时候做些什么
            return Promise.reject(err)
        }
    )
    axios.interceptors.response.use
    (
        res=>{
            //响应成功对相应的数据进行处理
            return res
        },err=>{
            //响应错误做些什么
            return err.Promise.reject(err)
        })
        //取消拦截器(仅作了解)
        let interceptors=axios.interceptors.request.use
        (config=>{
            config.headers={
                auth:true
            }
            return config
        })
        axios.interceptors.request.eject(interceptors)

        //实际开发的例子
        //登陆状态(token:'')，需要登陆的接口
        let instance=axios.create({})
        instance.interceptors.request.use(
            config=>{
                config.headers.token=''
                return config
            }
        )
        //访问不需要登陆的接口
        let newInstance=axios.create({})

        //移动端开发
        //请求前显示一个等待弹窗
        let instance_phone=axios.create({})
        instance_phone.interceptors.request.use(
            config=>{
                $('#modal').show()
                return config
            })
            //请求成功隐藏等待弹窗
            instance_phone.interceptors.response.use(res=>{
                response.use(res=>{
                    $('#modal').hide()
                    return res
                })
            })
  }
}
</script>